<!DOCTYPE html>

<html>

<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="../static/css/bootstrap.css">
    <link rel="stylesheet" href="../static/css/customer.css">
    <script src="../static/js/jquery.min.js"></script>
    <script src="../static/js/bootstrap.min.js"></script>
    <script src="../static/js/vue.js"></script>
    <script src="../static/js/axios.min.js"></script>
    <script src="../static/js/config.js"></script>
    <title> App 打包</title>
</head>
<style>
    .margin_40 {
        margin-top: 40px;
        color: red;
    }

    .redColor {
        color: red;
    }

    .grayColor {
        color: gray;
    }
</style>

<body>

    <div class="margin_40">

    </div>
    <div id="app" class="container-fluid">
        <div class="row">
            <div class="col-md-2">WTMS 移动网点版</div>

            <div class="col-md-6"></div>
            <div class="col-md-2 redColor">Andirod </div>
            <div class="col-md-2 redColor">IOS(打包完成会自动上传蒲公英，故页面没显示) </div>
        </div>
        <div class="margin_10"> </div>
        <div class="row">
            <div class="col-md-2"></div>
            <div class="col-md-2"></div>
            <div class="col-md-4"></div>
            <div class="col-md-2 grayColor">
                <button id="wtms__android_pack" type="button" class="btn btn-primary" v-on:click="package('android')">打包</button>
            </div>
            <div class="col-md-2 grayColor">
                <button id="wtms_ios_pack" type="button" class="btn btn-primary" v-on:click="package('ios')">打包</button>
            </div>
        </div>
        <div class="row">
            <ul style="margin: 0;padding: 0; list-style: none;">
                <li v-for="fileName in fileList" style="padding-top: 10px;padding-left: 15px;">
                    当前文件为:{{fileName}} <button type="button" class="btn btn-primary"
                        @click="downFile(fileName)">下载</button>
                </li>
            </ul>
        </div>

    </div>
    <!-- loading -->
    <div class="modal fade" id="loading" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"
        data-backdrop='static'>
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h4 class="modal-title" id="myModalLabel">打包中</h4>
                </div>
                <div class="modal-body">
                    请稍候。。。<span id="result"></span>
                </div>
            </div>
        </div>
    </div>

    <script>
        new Vue({
            el: "#app",
            data: {
                fileList: []
            },
            created() {
                this.getAllFile()
            },
            methods: {
                package(type) {
                    $('#loading').modal('show');
                    console.log(type);
                    axios.get(baseUrl +'/api/getUsers/' + type).then(response => {
                        if (response.data.code === '200') {
                            this.getAllFile()
                        } else {
                            console.log('请求失败');
                            $('#loading').modal('hide');
                        }
                    }).catch(error => {
                        console.log(error);
                    })
                },
                getAllFile() {
                    axios.get(baseUrl +"/api/getAllFile").then(response => {
                        if (response.data.code === '200') {
                            $('#loading').modal('hide');
                            for (filename of response.data.data) {
                                this.fileList.push(filename)
                            }
                        } else {
                            $('#loading').modal('hide');
                            console.log('请求失败');
                        }
                    })
                },
                downFile(filename) {
                    window.open( baseUrl +'/api/upload/' + filename)
                }
            }
        })
    </script>
</body>

</html>